import axios from 'axios'
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

// store.state.a
const moduleA = {
    namespaced: true,
    state: {
        count: 15
    },
    mutations: { //mutations['moduleA/addCount']
        addCount(state) {
            state.count++
        }
    },
    actions: {
        asyncAddCount(state) {
            setTimeout(() => {
                state.count++
            }, 1500)
        }

    },
    getters: {
        doubleCount(state) {
            return state.count * 2
        }
    }
}

export default new Vuex.Store({
    namespaced: true,
    state: {
        username: '', //用户名
        userclass: '', //文章类目
        userarticle: '', //文章总体数组
        userInfo: {}, //保存用户登陆后的状态,
        deleteCount: 0,

        articleCount: '', //文章个数
        obj: {}, //将文章分组
        objKey: 0, //分组key
        loading: false, //页面加载 用于滚动加载
        
        ArticleList: '', //每8项为一小组
        num: 0,
        imgurl: '',
        articleKey: '',
        classdata: {},
        WeatherData: []


    },
    mutations: {
        //同步 commit
        updateUsername(state, data) {
            //更新用户信息
            state.username = data
        },
        updateUserClass(state) {
            //更新文章类目信息
            axios.get('http://localhost/searchclass', {
                params: {
                    username: state.username
                }
            }).then(res => {

                // console.log(res)            
                state.userclass = res.data

                //将类目的 类型和数量进行遍历
                state.classdata = res.data.map((item) => {
                    return {
                        value: item.count,
                        name: item.class
                    }
                })
                //    console.log(state.classdata)

                // console.log('userarclass:'+state.userclass[0].class)

            }).catch(err => {
                console.log("获取数据失败" + err);
            })
        },
        updateUserArticle(state) {
            //更新文章信息
            axios.get('http://localhost/searcharticle', {
                params: {
                    username: state.username
                }
            }).then(res => {

                state.userarticle = res.data
                // console.log('state.userarticle:')
                // console.log(state.userarticle)
                state.articleCount = res.data.length
                localStorage.setItem('articleCount', JSON.stringify(state.articleCount))


                // console.log('objKey')

                // console.log(state.objKey)

                this.commit('grouping', state)

            }).catch(err => {
                console.log("获取数据失败" + err);
            })
        },
        updateArticleByKey(state) {
            console.log('搜索关键词是' + state.articleKey)
            //更新文章信息
            axios.get('http://localhost/searchArticleByKey', {
                params: {
                    articleKey: state.articleKey
                }
            }).then(res => {

                state.userarticle = res.data
                state.articleCount = res.data.length
                // localStorage.setItem('articleCount',JSON.stringify(state.articleCount))

                this.commit('grouping', state)



            }).catch(err => {
                console.log("获取数据失败" + err);
            })
        },
        //滚动事件
        scrolling(state) {


            // 获取窗口高度 winHeight 滚动出去的长度 st 文档的长度docHeight
            let winHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
            let st = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
            let docHeight = document.documentElement.scrollHeight || document.body.scrollHeight
            //objkey 会随着触底去累加， 如果objkey的长度大于 obj属性的个数 ，那么此时没有数组可以给他合并，这个时候就应该停止滚动
            if (state.objKey >= Object.keys(state.obj).length - 1) {
                state.loading = false; //已经到底了
                return
            }
            if (winHeight + st >= docHeight) {
                // console.log('触底了')
                //加载后续的内容 原本数组有8项，追加8项

                state.objKey++

                //这里要意识到 追加其实是合并 一个新的数组
                state.ArticleList = state.ArticleList.concat(state.obj[state.objKey])
                // console.log('触底后:')
                // console.log('state.objKey')
                // console.log(state.objKey)
                // console.log(state.ArticleList)
            }
        },
        //分组
        grouping(state) { //这里指state
            // console.log(state.articleCount)
            // console.log(state.obj)

            if (state.articleCount > 8) {
                //切割数组
                for (let i = 0; i < Math.ceil(state.articleCount / 8); i++) {
                    state.obj[i] = state.userarticle.slice(i * 8, (i + 1) * 8)
                    state.loading = true
                    if (i == Math.ceil(state.articleCount / 8)) {
                        state.loading = false
                    }
                }

                state.ArticleList = state.obj[state.objKey]

            } else {
                //数组不需要拆分直接显示
                state.obj = state.userarticle
                // console.log(state.obj)
                state.loading = false
            }
            // console.log('+state.ArticleList:')
            // console.log(state.ArticleList)
        }
    },
    actions: {
        //异步  dispatch

    },

    modules: {
        
        moduleA,
        b: {
            namespaced: true,
            state: {
                h: 19
            },
            getters: {
                hello() {
                    alert('哈哈h ')
                }
            },
            mutations: {
                hello3() {
                    alert('滚')
                }
            },
            actions: {
                hello2() {
                    alert('哈哈')
                }
            }
        }
    },
    methods: {

    },
})